<style lang="less">
</style>

<template>
    <div style="padding-left:80px">
        <el-form
            :model="queryForm"
            label-width="130px"
            style="height:150px"
            :rules="rules"
            ref="addformTwo"
            label-suffix="："
        >
            <el-row :getter="24">
                <el-col :span="18">
                    <el-form-item :label="$t('题库分类名称')" prop="categoryName">
                        <el-select
                            filterable
                            @change="changeSelect"
                            v-model="queryForm.categoryName"
                            :placeholder="$t('common.pla.pleaseSelect')"
                            clearable
                            style="width: 100%;"
                        >
                            <el-option
                                v-for="item in options.byCode"
                                :key="item.dicCode"
                                :label="item.cnName"
                                :value="item.dicCode"
                            ></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>
            <!-- <el-row :getter="24">
                <el-col :span="18">
                    <el-form-item :label="$t('题库分类名称')" prop="categoryName">
                        <el-input
                            v-model="queryForm.categoryName"
                            maxlength="32"
                            :placeholder="$t('请输入')"
                        ></el-input>
                    </el-form-item>
                </el-col>
            </el-row> -->
        </el-form>
        <el-row type="flex" class="row-bg" justify="end">
            <el-button @click="cancelDialog">{{ $t('overseasInstitutions.cancel') }}</el-button>
            <el-button type="primary" @click="conserve">
                {{ $t('overseasInstitutions.save') }}
            </el-button>
        </el-row>
    </div>
</template>

<script>
import { queryDic } from 'common/src/api/dictionary'
import UTILS from 'common/src/utils/utils'
import graduateStudent from 'common/src/api/graduateStudent/graduateStudent'
import interAcaConference from 'common/src/api/internationalCommunication/interAcaConference'
import { getALLCollege } from 'common/src/api/internationalExchanges/exchangeCollegeManagement'
import forumProject from 'common/src/api/academicForums/forumProject'
import examinationManagement from 'common/src/api/academicBehaviorNorms/examination/examinationManagement'

export default {
    props: {
        dataList: {
            type: String
        },
        dataProp: {
            type: String
        },
        dataListProp: {
            type: Object
        },
        dataQueryForm: {
            type: Object
        },
        showFlag: {
            type: Boolean
        },
        agent: {
            type: Boolean,
            default: false,
            required: false
        },
        admin: {
            type: Boolean,
            default: false,
            required: false
        }
    },
    data() {
        return {
            multipleSelection: [],
            dataList: [],
            fileList: [],
            queryForm: {
                categoryName: ''
                // dicCode: ''
            },
            list: {},
            innerVisible: false,
            id: '',
            options: {
                facultys: [],
                byCode: [],
                title: [],
                nationId: [],
                regionList: []
            },

            rules: {
                categoryName: [
                    { required: true, message: this.$t('请选择题库分类名称'), trigger: 'blur' }
                ]
            }
        }
    },
    watch: {
        dataListProp: {
            handler: function(newV, oldV) {
                if (this.dataProp == '编辑') {
                    this.queryForm = this.dataListProp
                } else {
                    this.queryForm.cnName = ''
                }
            },
            deep: true,
            immediate: true
        }
    },
    created() {
        this.changeByCode()
    },
    mounted() {},
    methods: {
        // 选择考卷语言
        changeByCode() {
            examinationManagement
                .getSubDicList({ enable: true, parentCode: 'B_CATEGORY' })
                .then(res => {
                    if (res && res.code == 200) {
                        this.options.byCode = res.data
                    }
                })
        },

        changeSelect(val) {
            if (val) {
                this.options.byCode.forEach(el => {
                    if (el.dicCode == val) {
                        this.list = el
                    }
                })
            }
        },
        // 内层弹出确定
        confirmInner() {
            this.dataListProp = {}
            this.$refs['addformTwo'].resetFields()
            this.innerVisible = false
            this.$emit('cancel-dialog', false)
        },
        // 内层弹出取消
        cancelInner() {
            this.innerVisible = false
        },
        // 内层弹出保存关闭
        confirmAndClose() {
            this.innerVisible = false
            this.conserve()
        },
        // 取消
        cancelDialog() {
            this.$refs['addformTwo'].resetFields()
            this.$emit('cancel-dialog', false)
        },

        // 保存
        conserve() {
            this.$refs['addformTwo'].validate(valid => {
                if (valid) {
                    if (this.dataProp === '新增') {
                        this.$emit('affirm-bank', this.queryForm, this.list)
                    } else {
                        this.queryForm.id = this.dataListProp.id
                        this.$emit('affirm-bank', this.queryForm, this.list, this.dataListProp)
                    }
                }
            })
        }
    }
}
</script>
